import React, { Component } from 'react';
import NewIcon from '../icon/index'
import { Text, View } from '@tarojs/components'
import './index.scss'
type Props = {
  isCheck?: Boolean
  onChange: Function,
  value?: String,
  disabled?: boolean
}
type State = {
  check: Boolean
}
export default class Check extends Component<Props> {
  state: {
    check: false
  }

  constructor(props: Props) {
    super(props);
    this.setState({
      check: props.isCheck
    })
  }

  Change(check: any) {
    check = !check;
    const { disabled } = this.props;
    if (disabled) return;
    this.props.onChange(check);
    this.setState({
      check
    });
  }

  render() {
    const { value, isCheck, disabled } = this.props;
    return (
      <View onClick={this.Change.bind(this, isCheck)} style="display: inline;">
        <NewIcon
          className={`icon iconfont ${isCheck? 'icon-kuang-01': 'icon-kuanghuise-01'}`}
          font="14"
          color={disabled? '#666': isCheck? '#0bbe7f': ''}
          top="4"
          style={`position: relative; top: 1px; margin-right: 8px;`}
        ></NewIcon>
        <Text>{value}</Text>
      </View>
    )
  }
}
